<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path=request.getContextPath();
	String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>  
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>>"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>登录</title>
	<style>
		body{
			font-size:14px;
			
		}
		table.altrowstable {
	    qont-family: verdana,arial,sans-serif;
		    border-width: 1px;
		    border-color: #a9c6c9;
		    border-collapse: collapse;
		    width: 300px;
		    height: 50px;
		    text-align:center;
		   
		}
		table.altrowstable th {
		    border-width: 1px;
		    padding: 8px;
		    border-style: solid;
		    border-color: #131a1b;
		}
		table.altrowstable td {
		    border-width: 1px;
		    padding: 8px;
		    border-style: solid;
		    border-color: #a9c6c9;
		}
		.td1 {
			width: 500px;
		}
		.input{
			background-color: transparent;
			border-width:0.5;
			text-align: center;
		}
		.oddrowcolor{
		    background-color:#d4e3e5;
		}
		.evenrowcolor{
		    background-color:#c3dde0;
		}
	</style>
</head>
<body>
	<form action="">
		<input type="hidden" id="userId" value="${manager.iUserId}"/>
		<div align="center">
			<table class="altrowstable" id="alternatecolor">
				<tr><td>姓名</td><td><input type="text" class="input" maxlength="10" id="name" name="sName" title="请输入中文名" value="${manager.sName}" /></td></tr>
				<tr><td>性别</td><td>
				<input type="radio" name="sex" value="2" class="sex" <c:if test="${manager.sSex==2}">checked="checked"</c:if>/>男 
				<input type="radio" name="sex" value="3" class="sex" <c:if test="${manager.sSex==3}">checked="checked"</c:if>/>女</td></tr>
				<tr><td>年龄</td><td><input type="text" maxlength="3" class="input" id="age" name="iAge" value="${manager.iAge}" onkeyup="value=value.replace(/[^(\d)]/g,'')"/></td></tr>
				<tr><td>身份证</td><td><input type="text" maxlength="18" class="input" id="idCard" name="sIdCard" value="${manager.sIdCard}" onkeyup="value=value.replace(/^[a-zA-Z]+\D*|^\d{0,16}[a-zA-Z]+|[^0-9Xx]/g,'')" 
					onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"/></td></tr>
				<tr><td>民族</td><td>
					<select id="nation" style="width: 100px; text-align: center;">
						<option value="" selected="selected">请选择民族</option>
						<c:forEach items="${nation}" var="item">
							<option value="${item.sNation}">${item.sNation}</option>
						</c:forEach>
					</select>
				</td></tr>
				<tr><td>电话</td><td><input type="text" maxlength="11" class="input" id="tel" name="sTel" value="${manager.sTel}" onkeyup="value=value.replace(/[^(\d)]/g,'')"/></td></tr>
				<tr><td>住址</td><td>
					<select id="province" style="width: 100px; text-align: center;" onchange="getCity()">
						<option value="" selected="selected">请选择省</option>
						<c:forEach items="${province}" var="item">
							<option value="${item.iProvinceId}">${item.sProvinceName}</option>
						</c:forEach>
					</select>
					<select id="city" style="width: 100px; text-align: center;" >
						<option value="" selected="selected">请选择市</option>
					</select>
				</td></tr>
				<tr><td colspan="2"><input type="button" value="修改" onclick="doUpdate()"/></td></tr>
			</table>
		</div>
	</form>
</body>
	<script type="text/javascript" src="js/jquery-3.2.1.js"></script>
	<script type="text/javascript">
	var flag = false;
	function doUpdate(){
		if("" == $("#name").val()||$("#name").val().match(/[^\u4e00-\u9fa5]/)){
			alert("请输入正确的姓名");
			return false;
		}
		if("" == $("#age").val()){
			alert("请选择年龄");
			return false;
		}
		if(18 != $("#idCard").val().length||!$("#idCard").val().match(/^\w+$/)){
			alert("请输入身份证号");
			return false;
		}
		if(11 != $("#tel").val().length){
			alert("请输入正确的手机号码");
			return false;
		}
		if(""==$("#city").val()){
			alert("请输入地址");
			return false;
		}
		var str = "manager/update.action?sMethod=update&iUserId="+$("#userId").val()+"&sName=" + $("#name").val()+"&sSex="+$(".sex:checked").val()+"&iAge="+$("#age").val()+
				"&sTel="+$("#tel").val()+"&sIdCard="+$("#idCard").val()+"&sNation="+$("#nation").val()+"&sAddress="+$("#province").find("option:checked").text()+$("#city").find("option:checked").text();
		alert(str);
		//window.location=str;
	}
	function getCity() {
		var str = "<option value='' selected='selected'>请选择市</option>";
		$.ajax({
			// 请求的地址
			url : "manager/passwordUpdate.action",
			// 是否是异步。
			async : false,
			// 回执的数据类型，默认为普通字符串
			dataType : "json",
			// 请求的数据
			data : {"sMethod":"getCity","iProvinceId":$("#province").val()},	
			// 请求后的回调方法。{"status":?,"msg":?}
			success : function(result) {
				console.log(result);
				//var json=result["json"];
				for(var i=0;i<result.length;i++){
					str += "<option value='"+result[i]["iProvinceId"]+"'>" +result[i]["sCityName"]+ "</option>";
				}
				$("#city").html(str);
			},
			type : "POST"
		});
	}
	</script>
</html>